<template>
	<view class="mine-wallet">
		<!-- 顶部导航栏 -->
		<view class="navbar">
			<view class="box_13">
				<!-- 左侧返回按钮 -->
				<image class="button" src="/static/images/common/back_two.png" mode="widthFix" @tap="back"></image>
				<text class="text_2">余额</text>
				<view class="occupy"></view>
			</view>
			<view class="box_14">
				<view class="recharge">
					<text class="recharge-title">充值</text>
					<image class="icon1" src="../../../static/images/mine/integral/recharge.png" @tap="recharge"></image>
				</view>
				<view class="withdrawal">
					<text class="withdrawal-title">提现</text>
					<image class="icon2" src="../../../static/images/mine/integral/withrawal.png" @tap="withdrawal"></image>
				</view>
				</view>
			<!-- 总资产 -->
			<view class="top">
				<view class="title-content">
					<image class="icon-images" src="/static/images/mine/integral/icon.png" mode="widthFix"></image>
					<view class="text">总资产(元)</view>
				</view>
				<view class="number-content">
					<view class="number">{{ user.integral }}</view>
				</view>
			</view>
		</view>
		<view class="content">
			<view class="title">明细</view>
			<view class="detail">
				<scroll-view class="scroll-panel" :scroll-top="scrollTop" scroll-y="true" @scrolltoupper="upper"
					@scrolltolower="lower" @scroll="scroll">
					<view class="null-text" v-if="list.length == 0">~ 暂无数据 ~</view>
					<block v-for="(res, index) in list" :key="index" v-else>
						<view class="section_5">
							<view class="text-group_8">
								<view class="text_7">{{ res.title }}</view>
								<view class="text_8">{{ res.date }}</view>
							</view>
							<view class="status-content">
								<view :class="res.status == 0 ? 'text_9' : 'text_10'">{{ res.status == 0 ? "+" + res.integral : "-" + res.integral }}</view>
							</view>
						</view>
						<view class="line"></view>
					</block>
					<view class="no-more" v-if="noMore">~ 没有更多了 ~</view>
				</scroll-view>
			</view>
		</view>
	</view>
</template>

<script>
	import Fn from '@/common/public.js';
	import navBar from "@/components/NavBar.vue" // 导入顶部导航
	import {
		integral_log
	} from '@/common/api.js';
	export default {
		components: {
			navBar
		},
		data() {
			return {
				/* 用户数据 */
				user: {
					integral: '456789.00', // 推广积分
				},
	
				/* 页面数据 */
				page: 1, // 首页
				totalPage: 0, // 总页数
				list: [{
					title: '充值',
					integral: '100.00',
					status: 0, // 0 - 获取 | 1 - 支出 
					date: '2022.12.22  16：40：30'
				}, {
					title: '购买商品',
					integral: '500.00',
					status: 1, // 0 - 获取 | 1 - 支出
					date: '2022.12.22  16：40：30'
				}], // 积分明细
				noMore: false, // 加载状态
				
				/* 滚动加载 */
				scrollTop: 0,
				old: {
					scrollTop: 0
				},
			};
		},
		onLoad() {
	
		},
		onShow() {
	
		},
		methods: {
	
			/* 返回上一页 */
			back() {
				uni.navigateBack()
			},
			
			recharge(){
				uni.navigateTo({
					url: '/pages/mine/wallet/walletDetail/recharge',
				});
			},
			withdrawal(){
				uni.navigateTo({
					url: '/pages/mine/wallet/walletDetail/withdrawal',
				});
			},
			/* 跳转至绿色积分转赠页面 */
			navigatePresent() {
				uni.navigateTo({
					url: '/pages/mine/credit/present/present',
				});
			},
			
			/* 获取明细 */
			getData() {
				const that = this;
				that.list = []; // 初始化列表
				that.page = 1; // 初始化页面
				const params = {
					page: that.page,
				};
				// withdrawal_Log(params).then(res => {
				// 	if (res.code === 0) {
				// 		const result = res.data;
				// 		// console.log(result);
				// 		that.balance = result.usdt; // USDT余额
				// 		that.nosa = result.nosa; // NOSA余额
				// 		that.totalPage = result.total_page;
				// 		that.charge = result.sxf_num;
				// 		that.list = result.list_data.map(item => {
				// 			return {
				// 				id: item.id, // 数据ID
				// 				title: that.i18n.text_ten + (item.type == 1 ? ' / USDT' :
				// 					' / NOSA') /* item.desc */ , // 标题
				// 				account: item.member, // 用户ID
				// 				date: item.add_time, // 创建时间
				// 				price: item
				// 					.amount, // 兑换数量 item.adds == 0 ? "-" + item.reduce : "+" + item.adds
				// 				fee: item.fee, // 手续费
				// 				status: item.draw_status, // 领取状态 0 - 待领取 | 1 - 已转入钱包 | 2 - 转入失败
				// 			};
				// 		});
				// 	} else if (res.code === 2) {
				// 		const result = res.data;
				// 		that.balance = result.usdt; // USDT余额
				// 		that.nosa = result.nosa; // NOSA余额
				// 		that.totalPage = result.total_page;
				// 		that.charge = result.sxf_num;
				// 		if (!result.total_page == 0) {
				// 			Fn.Toast(res.msg, 3, 1000);
				// 		}
				// 	};
				// }).catch((e) => {
				// 	console.log(e);
				// });
			},
			// 加载下一页信息
			getMoreData() {
				const that = this;
				const params = {
					page: that.page,
				};
				// withdrawal_Log(params).then((res) => {
				// 	if (res.code == 0) {
				// 		const result = res.data;
				// 		that.totalPage = result.total_page;
				// 		let moreList = result.list_data.map(item => {
				// 			return {
				// 				id: item.id, // 数据ID
				// 				title: that.i18n.text_ten /* item.desc */ , // 标题
				// 				account: item.member, // 用户ID
				// 				date: item.add_time, // 创建时间
				// 				price: item
				// 					.amount, // 兑换数量 item.adds == 0 ? "-" + item.reduce : "+" + item.adds
				// 				fee: item.fee, // 手续费
				// 				status: item.draw_status, // 领取状态 0 - 待领取 | 1 - 已转入钱包 | 2 - 转入失败
				// 			};
				// 		});
				// 		for (let i = 0; i < moreList.length; i++) {
				// 			that.list.push(moreList[i]);
				// 		};
				// 	} else {
				// 		Fn.Toast(res.msg, 3, 1500);
				// 	};
				// });
			},
			// 滚动加载
			upper(e) {
				// console.log(e)
			},
			lower(e) {
				// console.log(e)
				const that = this;
				if (that.page <= that.totalPage) {
					that.page = that.page + 1;
					that.getMoreData();
				};
			},
			scroll(e) {
				// console.log(e)
				this.old.scrollTop = e.detail.scrollTop
			},
		}
	}
	// import Fn from '@/common/public.js';
	// import {
	// 	reward,
	// 	balance_log,
	// 	integral_log,
	// 	billLad_log,
	// 	shopp_log,
	// 	bonusPoints_log,
	// 	GETuserinfo
	// } from '@/common/api.js';
	// export default {
	// 	data() {
	// 		return {

	// 			/* 账单详情滚动 */
	// 			old: {
	// 				scrollTop: 0
	// 			}, // 账单详情滚动设置

	// 			/* 加载更多 */
	// 			loading: {
	// 				status: 'loadmore', // 加载更多设置
	// 				loadingText: '加载中',
	// 				loadmoreText: '轻轻上拉加载更多',
	// 				nomoreText: '暂时没有了',
	// 			}, // 加载设置

	// 			/* 账单明细 */
	// 			pages: 1, // 页数
	// 			total_page: '', // 总页数
	// 			amount: 10, // 条数
	// 			money: '0', // 账户抢购分
	// 			integral: '0', // 消费积分
	// 			pick: '0', // 提货券抢购分
	// 			list: [], // 账单列表
	// 			buy: '0', // 购物券抢购分
	// 			rewardIntegral: '0', // 佣金积分
	// 			greenIntegral: '0', // 绿色积分
	// 		};
	// 	},
	// 	onLoad() {

	// 	},
	// 	onShow() {
	// 		/* 获取钱包数据明细 */
	// 		this.getDetail(); // 获取钱包数据明细
	// 	},
	// 	methods: {

	// 		/* 钱包明细 */
	// 		async getDetail() {
	// 			const that = this;
	// 			GETuserinfo().then((res) => {
	// 				const that = this;
	// 				if (res.status === 1) {
	// 					const result = res.data;
	// 					// console.log(result);
	// 					that.money = Fn.checkDigit({
	// 						number: result.drawMoney,
	// 						len: 1,
	// 						max: 100000000,
	// 						min: -1
	// 					});
	// 					that.buy = Fn.checkDigit({
	// 						number: result.shopp_roll,
	// 						len: 1,
	// 						max: 100000000,
	// 						min: -1
	// 					});
	// 					that.pick = Fn.checkDigit({
	// 						number: result.billLad,
	// 						len: 1,
	// 						max: 100000000,
	// 						min: -1
	// 					});
	// 					that.integral = Fn.checkDigit({
	// 						number: result.xf_integral,
	// 						len: 1,
	// 						max: 100000000,
	// 						min: -1
	// 					}); // 消费积分
	// 					that.rewardIntegral = Fn.checkDigit({
	// 						number: result.bonusPoints,
	// 						len: 1,
	// 						max: 100000000,
	// 						min: -1
	// 					});
	// 					that.greenIntegral = Fn.checkDigit({
	// 						number: result.reputation_value,
	// 						len: 1,
	// 						max: 100000000,
	// 						min: -1
	// 					});
	// 					// that.user.levelName = result.levelname;
	// 					// that.user.partnerName = result.partner_name;
	// 					// that.numbertips = result.dai_payment;
	// 					// that.user.userId = result.userId;
	// 					// that.user.levelName = result.levelname;
	// 					// that.user.buyOrder = result.total_buyorder;
	// 					// that.user.sellOrder = result.total_sellorder;
	// 					// that.user.advertisingNumber = result.reputation_value;
	// 					// that.user.balance = result.drawMoney;
	// 				} else {
	// 					Fn.Toast(res.msg, 3, 1500);
	// 				};
	// 			});
	// 			// const params = {
	// 			// 	page: that.pages,
	// 			// 	limit: that.amount
	// 			// };
	// 			// await reward().then((res) => {
	// 			// 	if (res.status === 1) {
	// 			// 		const result = res.data;
	// 			// 		// console.log(result);
	// 			// 		if (result != '') {
	// 			// 			that.money_one = Fn.checkDigit({
	// 			// 				number: result.drawMoney,
	// 			// 				len: 4,
	// 			// 				max: 100000000,
	// 			// 				min: -1
	// 			// 			}) /* result.drawMoney */ ;
	// 			// 		};
	// 			// 	} else {
	// 			// 		Fn.Toast(res.msg, 3, 1500);
	// 			// 	};
	// 			// });
	// 			// await integral_log(params).then((res) => {
	// 			// 	if (res.status === 1) {
	// 			// 		const result = res.data;
	// 			// 		// console.log(result);
	// 			// 		that.integral = result.integral_balance;
	// 			// 	} else {
	// 			// 		Fn.Toast(res.msg, 3, 1500);
	// 			// 	};
	// 			// });
	// 			// await billLad_log().then((res) => {
	// 			// 	if (res.status === 1) {
	// 			// 		const result = res.data;
	// 			// 		// console.log(result);
	// 			// 		that.pick = result.billLad_balance;
	// 			// 	} else {
	// 			// 		Fn.Toast(res.msg, 3, 1500);
	// 			// 	};
	// 			// })
	// 			// await shopp_log(params).then((res) => {
	// 			// 	if (res.status === 1) {
	// 			// 		const result = res.data;
	// 			// 		// console.log(result);
	// 			// 		if (result != '') {
	// 			// 			that.buy = Fn.checkDigit({
	// 			// 				number: result.shopp_roll,
	// 			// 				len: 4,
	// 			// 				max: 100000000,
	// 			// 				min: -1
	// 			// 			}) /* result.drawMoney */ ;
	// 			// 		};
	// 			// 	} else {
	// 			// 		Fn.Toast(res.msg, 3, 1500);
	// 			// 	};
	// 			// });
	// 			// await bonusPoints_log(params).then((res) => {
	// 			// 	if (res.status === 1) {
	// 			// 		const result = res.data;
	// 			// 		// console.log(result);
	// 			// 		if (result != '') {
	// 			// 			that.rewardIntegral = Fn.checkDigit({
	// 			// 				number: result.bonusPoints,
	// 			// 				len: 4,
	// 			// 				max: 100000000,
	// 			// 				min: -1
	// 			// 			}) /* result.drawMoney */ ;
	// 			// 		};
	// 			// 	} else {
	// 			// 		Fn.Toast(res.msg, 3, 1500);
	// 			// 	};
	// 			// })
	// 		},

	// 		/* 跳转至充值页面 */
	// 		navigateRecharge() {
	// 			uni.navigateTo({
	// 				url: '/pages/mine/wallet/recharge/recharge',
	// 			});
	// 		},

	// 		/* 跳转至充值明细页面 */
	// 		navigateRechargeDetail() {
	// 			uni.navigateTo({
	// 				url: '/pages/mine/wallet/rechargeDetail/rechargeDetail',
	// 			});
	// 		},

	// 		/* 跳转至提现页面 */
	// 		navigateExtract() {
	// 			uni.navigateTo({
	// 				url: '/pages/share/extract/extract',
	// 			});
	// 		},

	// 		/* 跳转至提现明细页面 */
	// 		navigateExtractDetail() {
	// 			uni.navigateTo({
	// 				url: '/pages/mine/wallet/extractDetail/extractDetail',
	// 			});
	// 		},

	// 		/* 跳转至提货券转赠页面 */
	// 		navigatePresent() {
	// 			uni.navigateTo({
	// 				url: '/pages/mine/wallet/voucherPresent/voucherPresent',
	// 			});
	// 		},

	// 		/* 跳转至抢购分转赠页面 */
	// 		navigateBalance() {
	// 			uni.navigateTo({
	// 				url: '/pages/mine/wallet/balancePresent/balancePresent',
	// 			});
	// 		},

	// 		/* 跳转至购物券转赠页面 */
	// 		navigateShop() {
	// 			uni.navigateTo({
	// 				url: '/pages/mine/wallet/shopPresent/shopPresent',
	// 			});
	// 		},

	// 		/* 跳转至绿色积分转赠页面 */
	// 		navigateGreenIntegralPresent() {
	// 			uni.navigateTo({
	// 				url: '/pages/mine/credit/present/present',
	// 			});
	// 		},
			
	// 		/* 跳转至抢购分转赠页面 */
	// 		navigateRewardPresent() {
	// 			uni.navigateTo({
	// 				url: '/pages/mine/wallet/rewardPresent/rewardPresent',
	// 			});
	// 		},

	// 		/* 跳转至购物券兑换页面 */
	// 		navigateShopExchange() {
	// 			uni.navigateTo({
	// 				url: '/pages/mine/wallet/shopExchangePick/shopExchangePick',
	// 			});
	// 		},

	// 		/* 跳转至购物券兑换页面 */
	// 		navigateRewardExchange() {
	// 			uni.navigateTo({
	// 				url: '/pages/mine/wallet/rewardExchange/rewardExchange',
	// 			});
	// 		},

	// 		/* 跳转至抢购分明细页面 */
	// 		navigateDetail() {
	// 			uni.navigateTo({
	// 				url: '/pages/mine/wallet/walletDetail/walletDetail',
	// 			});
	// 		},

	// 		/* 跳转至积分明细页面 */
	// 		navigateIntegral() {
	// 			uni.navigateTo({
	// 				url: '/pages/mine/wallet/integralDetail/integralDetail',
	// 			});
	// 		},

	// 		/* 跳转至购物券明细页面 */
	// 		navigateShopDetail() {
	// 			uni.navigateTo({
	// 				url: '/pages/mine/wallet/shopDetail/shopDetail',
	// 			});
	// 		},

	// 		/* 跳转至提货券明细页面 */
	// 		navigateVoucher() {
	// 			uni.navigateTo({
	// 				url: '/pages/mine/wallet/voucher/voucher',
	// 			});
	// 		},

	// 		/* 跳转至消费积分明细页面 */
	// 		navigateConsume() {
	// 			uni.navigateTo({
	// 				url: '/pages/mine/wallet/consumeIntegralDetail/consumeIntegralDetail',
	// 			});
	// 		},

	// 		/* 跳转至佣金积分明细页面 */
	// 		navigateReward() {
	// 			uni.navigateTo({
	// 				url: '/pages/mine/wallet/rewardIntegralDetail/rewardIntegralDetail',
	// 			});
	// 		},

	// 		/* 跳转至绿色积分明细页面 */
	// 		navigateGreenIntegral() {
	// 			uni.navigateTo({
	// 				url: '/pages/mine/credit/creditDetail/creditDetail',
	// 			});
	// 		},
	// 	}
	// }
</script>

<style lang="scss">
	page {
		background-color: #F4F5F7;
	}
	
	.mine-wallet{
	
		.navbar {
			background-color: #F71D1F;
			height: 380rpx;
	
			.box_13 {
				width: 100%;
				height: 100rpx;
				padding: 0 40rpx;
				display: flex;
				align-items: center;
				justify-content: space-between;
				box-sizing: border-box;
	
				.text_2 {
					width: 60%;
					color: #FFFFFF;
					font-size: 38rpx;
					font-weight: bold;
					text-align: center;
					white-space: nowrap;
					overflow-wrap: break-word;
				}
	
				.button {
					width: 50rpx;
					height: 50rpx;
				}
	
				.occupy {
					width: 50rpx;
					height: auto;
				}
			}
			.box_14{
				display: flex;
				align-items: center;
				justify-content: space-between;
				box-sizing: border-box;
				margin:5% 25% 0 25%;
				.recharge{
					text-align: center;
					display: flex;
					.recharge-title{
						color:#FFFFFF;
						font-size: 14px;
					}
					.icon1{
						margin-left:6px;
						width: 40rpx;
						height: 30rpx;
						margin-top:2px;
					}
				}
				.withdrawal{
					text-align: center;
					display: flex;
					.withdrawal-title{
						color:#FFFFFF;
						font-size: 14px;
					}
					.icon2{
						margin-left:6px;
						width: 40rpx;
						height: 40rpx;
					}
				}
			}
	
			.top {
				position: relative;
				top: 50rpx;
				background-color: #FFFFFF;
				margin: 0 36rpx;
				padding: 40rpx;
				border-radius: 10rpx;
	
				.title-content {
					display: flex;
					align-items: center;
	
					.icon-images {
						width: 30rpx;
						height: 30rpx;
					}
	
					.text {
						margin-left: 20rpx;
						color: #3F3F3F;
						font-size: 30rpx;
						font-family: AlibabaPuHuiTi_2_55_Regular;
					}
				}
	
				.number-content {
					margin-top: 10rpx;
					display: flex;
					align-items: center;
					justify-content: space-between;
	
					.number {
						font-size: 60rpx;
						font-family: AlibabaPuHuiTi_2_75_SemiBold;
					}
				}
			}
		}
	
		.content {
			margin-top: 100rpx;
			padding: 0 36rpx 10px 36rpx;
	
			.detail {
				margin-top: 30rpx;
				background-color: #FFFFFF;
				padding: 20rpx 40rpx 0 40rpx;
				border-radius: 8px;
				height: 900rpx;
				border: 1px solid #F0F1F1;
				
				.scroll-panel {
					max-height: 860rpx;
					
					.null-text {
						margin-top: 20rpx;
						color: #B6BCC5;
						font-size: 28rpx;
						font-family: AlibabaPuHuiTi_2_85_Bold;
						text-align: center;
					}
					
					.section_5 {
						margin: 30rpx 0;
						display: flex;
						align-items: center;
						justify-content: space-between;
							
						.text-group_8 {
							
							.text_7 {
								font-size: 28rpx;
								font-family: AlibabaPuHuiTi_2_75_SemiBold;
								text-align: left;
								white-space: nowrap;
								overflow-wrap: break-word;
							}
							
							.text_8 {
								margin-top: 16rpx;
								color: #838484;
								font-size: 24rpx;
								font-family: AlibabaPuHuiTi_2_55_Regular;
								text-align: left;
								white-space: nowrap;
								overflow-wrap: break-word;
								line-height: 32rpx;
							}
						}
						
						.status-content {
							
							.text_9 {
								font-size: 36rpx;
								font-family: AlibabaPuHuiTi_2_75_SemiBold;
								text-align: right;
								white-space: nowrap;
								overflow-wrap: break-word;
							}
							
							.text_10 {
								color: #F71D1F;
								font-size: 36rpx;
								font-family: AlibabaPuHuiTi_2_75_SemiBold;
								text-align: right;
								white-space: nowrap;
								overflow-wrap: break-word;
							}
						}
					}
					
					.line {
						height: 2rpx;
						background-color: #F0F1F1;
					}
					
					.no-more {
						text-align: center;
						margin: 40rpx 0 0 0;
						color: #B6BCC5;
						font-size: 14px;
					}
				}
			}
		}
	}
</style>
